﻿@model IEnumerable<App.Models.SysFunction>
<!DOCTYPE html>

<html>
<head>
    <title>MVC4+EF5+EasyUI+Unity</title>
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/themes/css")
    @Styles.Render("~/Content/themes/default/css")
    <link href="~/Content/main.css" rel="stylesheet" />
    <script src="@Url.Content("~/Scripts/EasyUi/jquery.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/EasyUi/jquery.easyui.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/EasyUi/locale/easyui-lang-zh_CN.js")" type="text/javascript"></script>
</head>
<body class="easyui-layout">
    <div id="OverTimeLogin" class="easyui-dialog" data-options="closed:true,modal:true">
        <iframe scrolling="auto" frameborder="0" style="width: 100%; height: 100%;"></iframe>
    </div>
    <div data-options="region:'north',border:false,split:false" class="define-head define-logo" style="height: 40px;">
        <div class="define-head">
            <div class="">
                <div id="LoginTopLine">System Manage</div>
                <div id="LoginBotoomLine">MVC4+EF5.0+EasyUI</div>
            </div>
            <div class="define-account">
            </div>
        </div>
    </div>
    <div data-options="region:'west',split:true,title:'菜单列表'" style="width: 210px">
        <div class="easyui-accordion" data-options="fit:true,border:false">
            @foreach (var item in Model)
            {
                <div title="@item.Name" data-options="iconCls:'@item.Iconic'" style="padding: 2px;">
                    <ul class="easyui-tree" data-options="fit:true,url:'../Menu/GetMenuGroupTree?SysFunctionid=@item.SysFunction_Id'">
                    </ul>
                </div>
            }
        </div>
        @*<iframe scrolling="auto" frameborder="0" src="/Menu" style="width: 100%; height: 99.5%;"></iframe>*@
    </div>
    <div data-options="region:'center',border:false">
        <div id="mainTab">
            <div title="我的桌面" data-options="closable:false" style="overflow: hidden; background: #fff">
                <iframe scrolling="auto" frameborder="0" src="~/Home" style="width: 100%; height: 100%;"></iframe>
            </div>
        </div>
    </div>
    <div data-options="region:'south',border:false" style="height: 20px;">
        <div class="define-bottom">
            Copyright shipengfei2015-2015
        </div>
    </div>
    <div id="tab_menu" class="easyui-menu" style="width: 150px;">
        <div id="tab_menu-tabrefresh" data-options="iconCls:'icon-reload'">
            刷新
        </div>
        <div id="tab_menu-openFrame">
            在新的窗体打开
        </div>
        <div id="tab_menu-tabcloseall">
            关闭所有
        </div>
        <div id="tab_menu-tabcloseother">
            关闭其他标签页
        </div>
        <div class="menu-sep">
        </div>
        <div id="tab_menu-tabcloseright">
            关闭右边
        </div>
        <div id="tab_menu-tabcloseleft">
            关闭左边
        </div>
        <div id="tab_menu-tabclose" data-options="iconCls:'icon-remove'">
            关闭
        </div>
    </div>
    <div id="tree_menu" class="easyui-menu" style="width: 150px;">
        <div id="tree_menu-open">
            打开
        </div>
        <div id="tree_menu-openFrame">
            在新的窗体打开
        </div>
    </div>

    <script type="text/ecmascript">

        $(function () {
            $('#tab_menu-tabrefresh').click(function () {
                /*重新设置该标签 */
                var url = $(".tabs-panels .panel").eq($('.tabs-selected').index()).find("iframe").attr("src");
                $(".tabs-panels .panel").eq($('.tabs-selected').index()).find("iframe").attr("src", url);
            });
            $('#tab_menu-openFrame').click(function () {
                /*重新设置该标签 */
                var url = $(".tabs-panels .panel").eq($('.tabs-selected').index()).find("iframe").attr("src");
                window.open(url);
            });
            //关闭当前
            $('#tab_menu-tabclose').click(function () {
                var currtab_title = $('.tabs-selected .tabs-inner span').text();
                $('#mainTab').tabs('close', currtab_title);
                if ($(".tabs li").length == 0) {
                    //open menu
                    $(".layout-button-right").trigger("click");
                }
            });
            //全部关闭
            $('#tab_menu-tabcloseall').click(function () {
                $('.tabs-inner span').each(function (i, n) {
                    if ($(this).parent().next().is('.tabs-close')) {
                        var t = $(n).text();
                        $('#mainTab').tabs('close', t);
                    }
                });
                //open menu
                $(".layout-button-right").trigger("click");
            });
            //关闭除当前之外的TAB
            $('#tab_menu-tabcloseother').click(function () {
                var currtab_title = $('.tabs-selected .tabs-inner span').text();
                $('.tabs-inner span').each(function (i, n) {
                    if ($(this).parent().next().is('.tabs-close')) {
                        var t = $(n).text();
                        if (t != currtab_title)
                            $('#mainTab').tabs('close', t);
                    }
                });
            });
            //关闭当前右侧的TAB
            $('#tab_menu-tabcloseright').click(function () {
                var nextall = $('.tabs-selected').nextAll();
                if (nextall.length == 0) {
                    $.messager.alert('提示', '前面没有了!', 'warning');
                    return false;
                }
                nextall.each(function (i, n) {
                    if ($('a.tabs-close', $(n)).length > 0) {
                        var t = $('a:eq(0) span', $(n)).text();
                        $('#mainTab').tabs('close', t);
                    }
                });
                return false;
            });
            //关闭当前左侧的TAB
            $('#tab_menu-tabcloseleft').click(function () {

                var prevall = $('.tabs-selected').prevAll();
                if (prevall.length == 0) {
                    $.messager.alert('提示', '后面没有了!', 'warning');
                    return false;
                }
                prevall.each(function (i, n) {
                    if ($('a.tabs-close', $(n)).length > 0) {
                        var t = $('a:eq(0) span', $(n)).text();
                        $('#mainTab').tabs('close', t);
                    }
                });
                return false;
            });
            //打开标签
            $('#tree_menu-open').click(function () {
                var data = $('#tree_menu').data("nodeData");
                var attributes = data.attributes;
                if(attributes){
                    addTab(data.text, attributes.url, data.iconCls);
                }
            });
            //在新窗口打开该标签
            $('#tree_menu-openFrame').click(function () {
                var data = $('#tree_menu').data("nodeData");
                var attributes = data.attributes;
                if(attributes){
                    window.open(attributes.url);
                }
            });

            $(".easyui-tree").tree({
                onClick: function (node) {
                    if ($(this).tree("isLeaf", node.target)) {
                        var attributes = node.attributes
                        if (attributes) {
                            addTab(node.text, attributes.url, node.iconCls);
                        }
                    }
                },
                onContextMenu: function (e, node) {
                    e.preventDefault();
                    if ($(this).tree("isLeaf", node.target)) {
                        var attributes = node.attributes
                        if (attributes) {
                            $('#tree_menu').data("nodeData", node);
                            $(this).tree('select', node.target);
                            $('#tree_menu').menu('show', {
                                left: e.pageX,
                                top: e.pageY
                            });
                        }
                    }
                }
            });

            $("#mainTab").tabs({
                fit: true,
                onContextMenu: function (e, title, index) {
                    e.preventDefault();
                    /*选中当前触发事件的选项卡 */
                    $('#mainTab').tabs('select', title);
                    //显示快捷菜单
                    $('#tab_menu').menu('show', {
                        left: e.pageX,
                        top: e.pageY
                    });
                    return false;
                }
            });

        });

        function addTab(subtitle, url, icon) {
            if (!$("#mainTab").tabs('exists', subtitle)) {
                var tabs = $("#mainTab").tabs('tabs');
                if (tabs.length > 14) {
                    $.messager.alert("温馨提示", "打开窗口太多，不能打开更多窗口", "info");
                    return;
                }
                $("#mainTab").tabs('add', {
                    title: subtitle,
                    content: createFrame(url),
                    closable: true,
                    icon: icon
                });
            } else {
                $("#mainTab").tabs('select', subtitle);
            }
        }

        function createFrame(url) {
            var s = '<iframe frameborder="0" src="' + url + '" scrolling="auto" style="width:100%; height:99%"></iframe>';
            return s;
        }

        $(function () {
            $(".ui-skin-nav .li-skinitem span").click(function () {
                var theme = $(this).attr("rel");
                $.messager.confirm('提示', '切换皮肤将重新加载系统！', function (r) {
                    if (r) {
                        $.post("../../Home/SetThemes", { value: theme }, function (data) { window.location.reload(); }, "json");
                    }
                });
            });
        });
    </script>
</body>
</html>
